<template>
    <!-- 聊天框界面 -->
    <div class="bigbox">
       <el-button type="success" size="small" @click="router.push('/message')">返回</el-button> 

        {{ channel.messagedata[id-1].name }}
    </div>
    <div class="chat">
        <div class="img1">
            <img :src="channel.messagedata[id-1].img" alt="cw" class="imgone">
            <div class="wz1">{{ channel.messagedata[id-1].message }}</div>
        </div>
        <div class="img2" v-if="enter1">
            <img :src="channel.userdata[channel.loginid].avatar" alt="cw" class="imgtwo">
            <div class="wz2">{{ mess }}</div>
        </div>
    </div>
    <input type="text" v-model="sendmessage" class="text" @keyup.enter="enter">
    <!-- 这里加一个发送按钮 -->
</template>

<script setup>
import { useRoute } from 'vue-router';
 import { useCounterStore } from '../../stores/counter'
 import { ref } from 'vue';
import router from '@/router';
 const channel = useCounterStore()
const route = useRoute();
const id =  route.query.id
console.log(id)

//发送的消息
const sendmessage = ref('');
//控制消息的发送
const enter1 = ref(false);
const mess = ref('')
//发送消息
const enter = () => {
    enter1.value = true;
    mess.value = sendmessage.value;
    sendmessage.value = '';
}

</script>


